<template>
	<view class="page">

		<!-- 	<u-navbar :placeholder="true" bgColor="#ffffff"> -->
		<view class="u-nav-slot topsearch" slot="left">
			<u-search placeholder="搜索你想要的功能" v-model="keyword" :animation="false" :showAction="false"
				@input="autoSearch()" :clearabled="false" :customActionStyle="customActionStyle" />
		</view>
		<view class="u-nav-slot" slot="right">
			<!-- <view class="searchbtn">
					搜索
				</view> -->
		</view>
		<!-- 	</u-navbar> -->
		<view class="u-menu-wrap">
			<view class="tab">
				<scroll-view class="scroll-X" :scroll-into-view="scrollTabId" :show-scrollbar='false'
					:scroll-with-animation="true">
					<view class="tab-item" v-for="(item,index) in tabList" :key="index"
						:class="{'tab-item-select':index==selectIndex}" :id="'tabId'+index"
						@click="changeTab(item,index)">

						<image :src="item.image" mode="widthFix"></image>
						<view class="pcs">
							{{item.title}}
						</view>
						<!-- <view class="tab-item-line" v-if="index==selectIndex"></view> -->
					</view>
				</scroll-view>
			</view>
			<view class="context" v-if="!isSearching">
				<swiper class="swiper" :current="selectIndex" @change="changeSwiper">
					<swiper-item v-for="(item,index) in tabList" :key="index">
						<view class="ppes">
							{{item.title}}
						</view>
						<scroll-view scroll-y="true" class="scroll-Y-chunk" :show-scrollbar='false'>
							<view class="context-box-item">

								<view class="context-box-item-chunk" v-for="(item,indexs) in item.list" :key="indexs"
									@click="goPage(item,indexs)">
									<view class="collect">
										<image @click.stop="toggleCollection(item,indexs)" v-if="item.loves == 1"
											:src="item.imagess"></image>
										<image @click.stop="toggleCollection(item,indexs)" v-else :src="item.images">
										</image>
									</view>

									<view class="context-box-item-chunk-title">
										{{item.title}}
									</view>
									<view style="width: 40%;">
										<image src="../../static/icon/q1.png" mode="widthFix"
											style="width: 15rpx;height: 15rpx;">
										</image>
										<text style="font-size: 20rpx;margin-left: 10rpx;">{{item.number}}万</text>
									</view>
									<view>
										<image :src="item.image" mode="widthFix"
											style="width:196.7rpx;position: absolute;right: 0;bottom: 0;"></image>
									</view>
								</view>
							</view>
							<view v-if="index === 0 && loves == ''" class="bg">
								<image src="../../static/create/scs.png" mode="widthFix"></image>
								<view class="title">
									您还没有收藏记录
								</view>
							</view>
						</scroll-view>
					</swiper-item>
				</swiper>
			</view>
			<view class="context" v-else>
				<swiper class="swiper" :current="selectIndex" @change="changeSwiper">
					<swiper-item v-for="(item,index) in tabList" :key="index">
						<scroll-view scroll-y="true" class="scroll-Y-chunk" :show-scrollbar='false'>
							<swiper-slide>
								<view class="context-box-item">

									<view class="context-box-item-chunk" v-for="(item,indexs) in filteredList1"
										:key="indexs" @click="goPage(item,indexs)">
										<view class="collect">
											<image @click.stop="toggleCollection(item,indexs)" v-if="item.loves == 1"
												:src="item.imagess"></image>
											<image @click.stop="toggleCollection(item,indexs)" v-else
												:src="item.images">
											</image>
										</view>

										<view class="context-box-item-chunk-title">
											{{item.title}}
										</view>
										<view style="width: 40%;">
											<image src="../../static/icon/q1.png" mode="widthFix"
												style="width: 15rpx;height: 15rpx;">
											</image>
											<text style="font-size: 20rpx;margin-left: 10rpx;">11万</text>
										</view>
										<view>
											<image :src="item.image" mode="widthFix"
												style="width:196.7rpx;position: absolute;right: 0;bottom: 0;"></image>
										</view>
									</view>
								</view>
							</swiper-slide>
						</scroll-view>
					</swiper-item>
				</swiper>
			</view>

		</view>

		<!-- 弹窗页面 -->
		<u-popup :show="statementShows" @click.stop="" mode="center" @close="close" :closeable="false"
			:closeOnClickOverlay="false" round="14">
			<view class="statementbox">
				<view class="statement">
					<image src="../../static/home/nosay.png" mode=""></image>
				</view>
				<view class="statemens">
					<image src="../../static/home/jyla.jpg" mode=""></image>
				</view>
				<view class="statementtext">
					你的账号存在违规,请联系客服解封
					如以解封，请删除重进，有五分钟缓冲时间
				</view>
				<view class="surebtnstyle">
					<view class="surebtn" @click="close">
						联系客服
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
	import {
		apiMixUrlApi
	} from "../../api/assemb";
	export default {
		data() {
			return {
				statusBarHeight: 20,
				/* 状态栏高度 */
				top: 0,
				navBarHeight: 45,
				/* 导航栏高度 */
				statementShows: false,
				searchBarTop: 0, //搜索栏的外边框高度，单位px
				searchBarHeight: 0, //搜索栏的高度，单位p
				keyword: '',
				selectIndex: 1,
				scrollTabId: 'tabId0',
				message: 'aa',
				// 自定义右侧控件样式
				customActionStyle: {
					background: '#F2F2F2',
					color: '#919191',
					fontSize: '27rpx'
				},
				tabList: [{
						title: '收藏',
						type: 9,
						love: 1,
						list: [],
						image: '/static/icon/psc.png',
					},
					{
						title: '媒体写作',
						type: 1,
						list: [],
						image: '/static/icon/a1s.png',
					},

					{
						title: '工作助手',
						type: 2,
						list: [],
						image: '/static/icon/a2s.png',
					},

					{
						title: '生活助手',
						type: 3,
						list: [],
						image: '/static/icon/a3s.png',
					},
					{
						title: '教育助手',
						type: 4,
						list: [],
						image: '/static/icon/a4s.png',
					},
					// {
					// 	title: '电商',
					// 	type: 4,
					// 	list: []
					// },
					// {
					// 	title: '营销广告',
					// 	type: 5,
					// 	list: []
					// },
					// {
					// 	title: '网站',
					// 	type: 6,
					// 	list: []
					// },
					// {
					// 	title: '文学',
					// 	type: 7,
					// 	list: []
					// },
					// {
					// 	title: '媒体写作',
					// 	type: 8,
					// 	list: []
					// },
					// {
					// 	title: '短视频',
					// 	type: 2,
					// 	list: []
					// },
				],
				aList: [], // 展示的数据
				filteredList1: [], // 新增
				loves: [],
				isSearching: false,
				contextList: [{
						tab: 0,
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway48.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '新媒体写作',
						content: '一键生成新媒体文章（大约30秒）',
						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/newMedia/newMedia',
						url: '/pages_create/newMedia/newMedia',
						number: 11
					},
					// {
					// 	type: 1,
					// 	image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway49.png',
					// 	images: '/static/create/sc.png',
					// 	imagess: '/static/create/scc.png',
					// 	loves: 0,
					// 	title: '小红书标题',
					// 	content: '为你的小红书笔记生成充满点击欲的标题',
					// 	number: 12,
					// 	url: 'https://www.peiyine.com/aixzzj/pink/#/pages/redBook/redBook'

					// },
					{
						tab: 0,
						zt: '内容',
						id: 95,
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway50.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '短视频带货',
						content: '电动牙刷',
						number: 10,
						url: '/pages_create/video/video',
					},

					{
						number: 11,
						tab: 0,
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway1.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '小红书文案',
						content: '帮你生成复合小红书调性的分享文案',
						url: '/pages_create/redBookWriting/redBookWriting',
					},
					{
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway4.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '短视频文案',
						content: '生成vlog、口播稿等短视频的拍摄大纲',
						// url: '/pages_aiTools/video/video',
						number: 11,
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/video/video'
					},
					{
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway7.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '视频灵感',
						content: '蹭点热点拍视频？让我们来提供灵感',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/dyInspiration/dyInspiration',
						number: 10
					},
					{
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway6.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '视频标题',
						content: '快速帮你打造有吸引力的视频标题',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/dyTitle/dyTitle',
						number: 9
					},
					{
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway13.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '美食探店',
						content: '进行一场开开心心的探店之旅吧',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/redbookRestaurant/redbookRestaurant',
						number: 9
					},
					{
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway12.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '小说',
						content: '可以生成各种风格类型的小说',
						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/fiction/fiction',
						url: '/pages_create/fiction/fiction',
						tab: 0,
						number: 11
						// url: 'http://192.168.3.50/#/pages/fiction/fiction'
					},
					{
						title: '口播文案',
						number: 10,

						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway9.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
							url: 'https://www.peiyine.com/aixzzj/pink/#/pages/dyOralDraft/dyOralDraft'
					},
					{

						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway8.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '散文',
						url:'https://www.peiyine.com/aixzzj/pink/#/pages/prose/prose',
						number: 8
					},
					{
						tab: 0,
						type: 1,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway37.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '学生作文',
						content: '为中小学生题目提供优秀范文，帮助你学习',
						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/studentComposition/studentComposition'
					url: '/pages_aiTools/studentComposition/studentComposition',
						number: 10
					},

					{

						id: 157,
						zt: '内容',
						nr: '主题',
						tab: 2,
						tabs: '健康饮食',
						tablist: '肥胖带来的危害',

						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway47.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: 'ppt大纲',
						number: 9
					},
					{
						tab: 0,
						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway19.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '日报/周报',
						content: '根据工作内容生成日报，周报，月报',
						url: '/pages_create/reports/reports',
						number: 11
					},
					{
						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway20.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '营销策划',
						content: '戳中用户痛点，打造爆款产品',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/marketing/marketing',
						number: 10
					},
					{
						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway41.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '广告文案',
						content: '生成针对各种广告的内容以及文案',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/advertising/advertising',
						number: 7
					},
					{
						id: 169,
						zt: '调查内容',
						tab: 4, //单一框 带字

						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway18.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '调查问卷',
						content: '污水排放问题',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/advertising/advertising',
						number: 7
					},
					{
						id: 248,
						zt: '调研内容',
						tab: 4, //单一框 带字

						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway25.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '竞品调研',
						content: '新能源汽车竞品调研',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/advertising/advertising',
						number: 6
					},
					{
						id: 197,
						zt: '宣传内容',
						tab: 4, //单一框 带字

						type: 2,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway37.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '反诈宣传',
						content: '淘宝刷单',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/advertising/advertising',
						number: 8
					},
					{
						type: 3,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway22.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '大厨私房菜',
						content: '一键生成各菜系菜单，帮你找到你想要的',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/kitchen/kitchen',
						number: 8
					},
					{
						number: 9,
						type: 3,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway23.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '宝宝取名',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/BBName/BBName'
						// url: 'https://www.peiyine.com/aixzzj/appletblue/#/pages/adDivorce/adDivorce'
						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/reedBooktravel/reedBooktravel'
					},
					{

						zt: '故事内容',
						id: 72,
						tab: 3,
						type: 3,
						title: '睡前故事',
						content: '老狼和小狐狸的故事',

						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway24.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						number: 10

						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/reedBooktravel/reedBooktravel'
					},
					{
						type: 3,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway26.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '减肥计划',

						id: 134,
						zt: '关键词',
						nr: '周期/时间',
						tab: 2,
						tabs: '运动减肥',
						tablist: '三个月',
						number: 9


						// url: 'https://www.peiyine.com/aixzzj/pink/#/pages/reedBooktravel/reedBooktravel'
					},
					{
						type: 3,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway31.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '好评文案',
						content: '生成针对各种广告的内容以及文案',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/reputation/reputation',
						number: 10
					},
					{
						type: 3,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway29.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '旅游攻略',
						content: '根据目的地和旅游天数生成旅游的攻略',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/reedBooktravel/reedBooktravel',
						number: 13
					},

					{
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway37.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '学科出题',
						content: '一键生成各个学科题目，快捷方便',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/SubjectIssue/SubjectIssue',
						number: 12
					},
					{
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway38.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '教案计划',
						content: '生成合适的教学文案',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/teachingPlan/teachingPlan/',
						number: 12
					},
					{
						number: 9,
						id: 185,
						zt: '主题',
						tab: 4, //单一框 带字
						loves: 0,

						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway39.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '读书心得',
						content: '读书会心得',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/fullText/fullText'
					},
					{
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway35.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '课程设计',
						content: '按照写作步骤一步步生成文章',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/fullText/fullText',
						number: 9
					},
					{
						number: 8,
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway42.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '全文写作',
						content: '按照写作步骤一步步生成文章',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/fullText/fullText'
					},
					{
						number: 10,
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway10.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '万能翻译',
						content: '一键式多语言翻译，助你方便快捷',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/translate/translate'
					},
					{
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway17.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '学习计划',
						content: '针对各阶段学科生成学习计划',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/studyPlan/studyPlan',
						number: 9
					},
					{
						number: 9,
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway43.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '知乎问答',
						content: '生成一些能够引起热烈讨论的好问题',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/zhihuAnswer/zhihu'
					},
					{
						number: 9,
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway35.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '考研题目',
						content: '针对考验生成各个学科的题目',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/ordeal/ordeal'
					},
					{
						number: 10,
						type: 4,
						image: 'https://iflytts.oss-cn-qingdao.aliyuncs.com/images/wxapp/nway44.png',
						images: '/static/create/sc.png',
						imagess: '/static/create/scc.png',
						loves: 0,
						title: '论文',
						content: '提供优秀范文',
						url: 'https://www.peiyine.com/aixzzj/pink/#/pages/paper/paper'
					},
				],
			}
		},
		computed: {
			filteredList() {
				if (this.aList.length === 0) {
					return []
				} else {
					const reg = new RegExp(this.searchValue, 'i')
					return this.aList.filter(item => {
						return item.title.match(reg) || item.content.match(reg)
					})
				}
			}
		},

		onLoad() {
			if (uni.getStorageSync('ban')) {
				this.statementShows = true;
			} else {
				this.statementShows = false;
			}
			// console.log(uni.getStorageSync('ban'), '======================')
			// if (uni.getStorageSync('ban')) {
			// 	this.statementShows = true;
			// } else {
			// 	this.statementShows = false;
			// }
			//   console.log('onInit',this.tabList[1].List)
			let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
			console.log(menuButtonInfo, '这是机型的大小')
			this.top = menuButtonInfo.top - 22
			let tops = this.top / 2
			console.log(tops, '对不对在这里说')
			console.log(this.top, '----------------------')
			this.searchBarTop = menuButtonInfo.top;
			this.searchBarHeight = menuButtonInfo.height;
			let that = this

			this.loves = uni.getStorageSync('loves') || []; // 从缓存中读取数据
			this.loves.forEach(item => {
				if (this.loves.includes(item)) { // 如果loves中包含当前item
					that.tabList[0].list.push(item);
				}
			});

			this.loves.forEach((loveItem, loveIndex) => {
				this.contextList.forEach((contextItem, contextIndex) => {
					if (contextItem.title === loveItem.title && loveItem.loves !== undefined && loveItem
						.loves !== null) {
						// 将 this.loves 中的 loves 字段赋值给 this.contextList 中对应的 loves 字段  
						this.contextList[contextIndex] = loveItem;
					}
				});
			});

			this.contextList.forEach(item => {
				switch (item.type) {
					case 1:
						that.tabList[1].list.push(item);
						break
					case 2:
						that.tabList[2].list.push(item);
						break
					case 3:
						that.tabList[3].list.push(item);
						break

					case 4:
						that.tabList[4].list.push(item);
						break
						// case 5:
						// 	that.tabList[6].list.push(item);
						// 	break
						// case 6:
						// 	that.tabList[6].list.push(item);
						// 	break
						// case 7:
						// 	that.tabList[7].list.push(item);
						// 	break
						// case 8:
						// 	that.tabList[8].list.push(item);
						// 	break
						// case 10:
						// 	that.tabList[3].list.push(item);
						// 	break
				}
			})
			// this.tabList[0].list = this.contextList
			//   console.log("?? ~ file: create.vue:193 ~ onLoad ~ this.contextList:", this.contextList)

		},
		onShow() {
			console.log(uni.getStorageSync('ban'), '======================')
			if (uni.getStorageSync('ban')) {
				this.statementShows = true;
			} else {
				this.statementShows = false;
			}
			// 获取次数
			this.getFrequency();
		},
		methods: {
			getRandom() {
				return Math.floor(Math.random() * 15) + 5; // 生成10到50的随机数  
			},
			// 获取次数
			getFrequency() {
				apiMixUrlApi({}, 1042, 'GetPaymentInfo').then(data => {
					if (data.descinfo == "success") {
						uni.setStorageSync('frequencyrs', data.coins)
					}
				});
			},
			//点击跳转客服
			close() {
				uni.navigateTo({
					url: '/pages/service/service'
				})
			},
			//切换tab
			changeTab(item, index) {
				console.log(index, '000000')
				this.isSearching = false // 标记当前是否处于搜索状态
				console.log("?? ~ file: create.vue:197 ~ changeTab ~ item:", item, index)
				this.selectIndex = index
				let number = (index - 1) < 0 ? 0 : (index - 1)
				this.scrollTabId = 'tabId' + number
			},
			//切换swiper
			changeSwiper(e) {
				//   console.log("?? ~ file: create.vue:204 ~ changeSwiper ~ e:", e)
				this.selectIndex = e.detail.current
				let number = (e.detail.current - 1) < 0 ? 0 : (e.detail.current - 1)
				this.scrollTabId = 'tabId' + number
			},
			toggleCollection(item) {
				// 切换 item.loves 的状态  
				item.loves = (item.loves === 1) ? 0 : 1;

				if (item.loves === 1) {
					if (!this.loves.includes(item)) {
						this.tabList[0].list.push(item);
						this.loves.push(item);
						uni.setStorageSync('loves', this.loves);
					}
				} else {
					// 如果 item.loves 不为 1，从 this.tabList[2].list 中移除该项    
					const index = this.tabList[0].list.indexOf(item);
					const lovesIndex = this.loves.indexOf(item);
					if (lovesIndex !== -1) {
						this.loves.splice(lovesIndex, 1);
					}
					uni.setStorageSync('loves', this.loves); // 从缓存中移除该项    
					if (index !== -1) {
						this.tabList[0].list.splice(index, 1);
					}
				}
			},
			//跳转页面
			goPage(item) {
				console.log('item', item)
				console.log('item.url', item.url)
				// const id = 3
				if (item.tab == 0) {
					console.log('item.url', item.url)

					uni.navigateTo({
						url: item.url
					});
					console.log('11')
				} else if (item.tab == 3) {
					uni.navigateTo({
						url: '/pages_otherTools/peoper/peoper?title=' + item.zt + '&footer=' + item
							.title + '&id=' + item.id + '&content=' + item.content,
					})
				} else if (item.tab == 2) {
					uni.navigateTo({
						url: '/pages_otherTools/invitation/invitation?title=' + item.zt + '&footer=' + item
							.title + '&id=' + item.id + '&content=' + item.tablist + '&tab=' + item.tabs +
							'&nr=' + item.nr,
					})
				} else if (item.tab == 4) {
					uni.navigateTo({
						url: '/pages_otherTools/rectification/rectification?title=' + item.zt + '&footer=' + item
							.title + '&id=' + item.id + '&content=' + item.content,
					})
				} else {
					uni.navigateTo({
						url: '/pages/webview/webview?url=' + item.url
					});
					console.log('22')
				}
			},

			searchClick(value) {
				if (!value) { // 简化了值为空字符串和值为 null 和 undefined 的情况
					console.log('123')
					this.isSearching = false // 标记当前是否处于搜索状态
					// 如果输入的值为空则加载所有的列表
					// this.getList();
				} else {
					console.log('456')
					// 先清空展示的数据
					this.aList = []
					// 然后开始循环全部数据
					for (var i = 0; i < this.contextList.length; i++) {
						const item = this.contextList[i] // 将当前子项存储至一个变量中，避免频繁访问 this.contextList[i]
						// 判断数据里面是否有符合输入的内容
						//（核心所在，其它都是根据需求来自己写）
						if (item.title && item.title.indexOf(value) >= 0) { // 先判断该属性值是否存在再进行搜索
							this.aList.push(item)
							console.log('this.aList', this.aList)
						}
					}

					this.isSearching = true // 标记当前处于搜索状态
					this.filteredList1 = [...this.aList] // 将匹配值直接赋给 filteredList 数组，用于渲染
				}
				// 因为 aList 变量改变了，所以此处需要手动触发一次  的更新
				this.$forceUpdate() // 强制当前实例重新渲染，包括组件和子组件
			},



			toggleShowSearchResult() {
				this.showSearchResult = !this.showSearchResult
			},
			autoSearch: function() {
				this.searchClick(this.keyword)
			},
			// searchClick(value) {
			//   if (!value) {
			//     this.isSearching = false
			//     return;
			//   }
			//   this.filteredList1 = this.contextList.filter(item => item.title.indexOf(this.keyword) >=0 )
			//   this.isSearching = true
			// }

		}
	}
</script>
<style lang="less">
	.page {
		background: white;
	}

	.u-menu-wrap {
		flex: 1;
		display: flex;
		overflow: hidden;
		margin: 0 26rpx 0 0;
		padding-bottom: 30rpx;
		height: calc(100vh - 50px);
		background: #f8f8f8;
	}

	.statementbox {
		width: 620rpx;
		// height: 572rpx;

		.statement {
			display: flex;
			justify-content: center;
			margin-top: 50rpx;

			image {
				width: 114rpx;
				height: 114rpx;
			}
		}

		.statemens {
			display: flex;
			justify-content: center;
			margin-top: 50rpx;

			image {
				width: 220rpx;
				height: 66rpx;
			}
		}

		.statementtext {
			// margin-left: 300rpx;
			font-size: 26rpx;
			margin-top: 60rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
			margin: 0 115rpx;
			margin-top: 58rpx;
			margin-bottom: 48rpx;
		}

		.surebtnstyle {
			display: flex;
			justify-content: center;

			.surebtn {
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 34rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #ffffff;
				width: 440rpx;
				height: 117rpx;
				background-repeat: no-repeat;
				background-size: cover;
				background-image: url("https://mysmallapp.oss-cn-shanghai.aliyuncs.com/aixz/img/xzybg.png");
			}
		}
	}

	.bg {
		margin-top: 30%;
		margin-left: 90rpx;
		width: 400rpx;
		height: 400rpx;

		image {
			width: 100%;
			height: 100%;
		}

		.title {
			font-size: 36rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #9F9F9F;
			margin-top: 30rpx;
			margin-left: 50rpx;
			;
		}

		// background:#E7F4FD;
		// background-size: cover; /* 背景图填充整个视图 */
		// background-repeat: no-repeat;
	}

	.page {
		width: 100%;
		height: 100vh;
		background-color: #f7f7f7;
		overflow: hidden;
	}

	.tab {
		width: 160rpx;
		height: 780rpx;
		margin-top: 20px;
		background: #FFFFFF;
		border-radius: 0rpx 24rpx 24rpx 0rpx;
		opacity: 1;
		// position: fixed;
		left: 0;
		// z-index: 99;

		.scroll-X {
			width: 100%;
			height: 100%;
			white-space: nowrap;

			.tab-item {
				width: 148rpx;
				height: 128rpx;

				border-radius: 0rpx 16rpx 16rpx 0rpx;
				opacity: 1;
				margin-top: 25rpx;
				font-size: 30rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;

				// height: 50px;
				/* position: relative; */
				font-size: 30rpx;

				.pcs {
					margin-top: 20rpx;
					font-size: 24rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #373A41;
					line-height: 0rpx;
				}

				image {
					height: 52rpx;
					width: 52rpx;
				}

				.tab-item-line {
					width: 30rpx;
					height: 6rpx;
					position: absolute;
					bottom: 14rpx;
					left: 50%;
					transform: translateX(-50%);
					background-color: #4bb591;
				}
			}

			.tab-item-select {
				background: #FFF6F8;
				color: #333333;
				border-left: 2px solid #FFB8C2;
			}
		}
	}

	.context {
		width: 100%;
		background-color: #f7f7f7;
		box-sizing: border-box;
		// margin-top: 100rpx;

		.swiper {
			width: 100%;
			height: 100%;

			.ppes {
				width: 96rpx;
				height: 70rpx;
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				color: #6D6D6D;
				line-height: 0rpx;
				margin-top: 20rpx;
				margin-left: 40rpx;
				display: flex;
				align-items: center;
			}

			.scroll-Y-chunk {
				width: 100%;
				height: 95%;

				.context-box-item {
					width: 100%;
					display: flex;
					flex-wrap: wrap;
					box-sizing: border-box;
					/* padding: 30rpx 30rpx 10rpx; */
					// margin-top: 30rpx;

					.context-box-item-chunk {

						position: relative;

						width: 259rpx;
						height: 245rpx;
						border-radius: 17rpx 17rpx 17rpx 17rpx;
						background-color: #fff;
						margin-bottom: 30rpx;
						box-sizing: border-box;
						padding: 0 20rpx;
						margin-left: 20rpx;
						// box-shadow: 1px 1px 8px 2px #e4ecf1;

						.context-box-item-chunk-image {
							width: 100%;
							display: flex;
							align-items: center;
							margin-top: 30rpx;

							.context-box-item-chunk-image-shadow {
								padding: 6rpx;
								background-color: #f3efef;
								border-radius: 50%;
								display: flex;
								justify-content: center;
								align-items: center;
							}
						}

						.context-box-item-chunk-title {

							margin-top: 20rpx;
							width: 180rpx;
							height: 40rpx;
							font-size: 28rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: bold;
							color: #373A41;

						}

						.context-box-item-chunk-text {
							width: 100%;
							font-size: 22rpx;
							color: #939393;
							margin-top: 20rpx;
							box-sizing: border-box;
						}
					}
				}
			}
		}
	}

	.search {
		// width: 100%;
		height: 200rpx;
		background-color: #fff;
		margin-top: 82rpx;
		padding-left: 20rpx;
		display: flex;
		justify-content: space-between;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
		width: 100%;

		// border: 2px solid red;
		.searchs {
			height: 44rpx;
			width: 108rpx;
			border: 1rpx solid #929292;
			border-radius: 25.8rpx;
			text-align: center;
			position: absolute;
			top: 11.3rpx;
			right: 250rpx;
			color: #333333;
		}
	}

	.search_bto {
		width: 100rpx;
		height: 60rpx;
		background-color: #00df66;
		margin: 0 40rpx 0;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 15rpx;
	}

	.search_text {
		color: #fff;
		line-height: 80rpx;
	}

	/deep/::-webkit-scrollbar {
		display: none;
		width: 0 !important;
		height: 0 !important;
		-webkit-appearance: none;
		background: transparent;
		color: transparent;
	}

	.topsearch {
		width: 700rpx;
		margin-left: 25rpx;
		margin-top: 10px;
	}

	.searchbtn {
		width: 99rpx;
		margin-right: 200rpx;
		height: 47rpx;
		background: #ffffff;
		border: 1px solid #333333;
		border-radius: 39rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 27rpx;
	}

	.collect {

		/* margin-left: 100rpx; */
		position: absolute;
		right: 20rpx;
		/* top: 20p; */
		top: 20rpx;

		image {
			width: 28rpx !important;
			height: 28rpx !important;
		}
	}
</style>